<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
			"http://www.w3.org/TR/REC-html40/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Register to Win!</title>
<style type="text/css" media="screen">
td {padding: 0.25em 1px;}
td.lbl {font-weight: bold; text-align: right;}
tr.required td.lbl {background: #FCC; border-color: red;}

   /* Above, we change onnly the color of the border, and the rest of
      of the border's aspects - style and width - are set in the rule
      below.  This work because all of the "label" cells are classed
      'lbl' including the ones in the 'required' rows.  The rule above
      simply overrides 'green' with 'red'; this works because its
      selector has a higher specificity and so carries more weight. */

td.lbl {background: #CFC; border-left: 0.5em solid green;}
div#submitArea {text-align: center; margin-top: 1em; padding-top: 1em;}
</style>
</head>
<body>

<form action="somescript.cgi">

<h1>Register to Win!</h1>
<table cellspacing="0">
<tr class="required">
<td class="lbl">First name:</td>
<td class="inp"><input type="text" name="userFName" size="60" maxlength="100"></td>
</tr>
<tr class="required">
<td class="lbl">Last name:</td>
<td class="inp"><input type="text" name="userLName" size="60" maxlength="100"></td>
</tr>
<tr class="required">
<td class="lbl">E-mail address:</td>
<td class="inp"><input type="text" name="userEmail" size="60" maxlength="100"></td>
</tr>
<tr class="required">
<td class="lbl">State of residence:</td>
<td class="inp"><select name="userState">
<option>Alabama</option>
<option>Alaska</option>
<option>Arizona</option>
<option>Arkansas</option>
<option>California</option>
<option>Colorado</option>
<option>Connecticut</option>
</select>
</td>
</tr>
<tr class="required">
<td class="lbl">Zip code:</td>
<td class="inp"><input type="text" name="userZip" size="20" maxlength="20"></td>
</tr>
<tr>
<td class="lbl">Age:</td>
<td class="inp">
<input type="radio" name="userAge" value="18-24">18-24
<input type="radio" name="userAge" value="25-34">25-34
<input type="radio" name="userAge" value="35-49">35-49
<input type="radio" name="userAge" value="50-64">50-64
<input type="radio" name="userAge" value="65+">65+
</td>
</tr>
<tr>
<td class="lbl">Education:</td>
<td class="inp">
<input type="radio" name="userEdu" value="HS">High school
<input type="radio" name="userEdu" value="BABS">BA/BS
<input type="radio" name="userEdu" value="Mast">Masters
<input type="radio" name="userEdu" value="PhD">Ph.D.
<input type="radio" name="userEdu" value="other">other
</td>
</tr>
<tr>
<td class="lbl">Interests:</td>
<td class="inp">
<input type="checkbox" name="userIntr" value="camping">Camping
<input type="checkbox" name="userIntr" value="sports">Sports
<input type="checkbox" name="userIntr" value="movies">Movies
<input type="checkbox" name="userIntr" value="music">Music
<input type="checkbox" name="userIntr" value="books">Books
<input type="checkbox" name="userIntr" value="photo">Photography
<input type="checkbox" name="userIntr" value="other">other
</td>
</tr>
</table>
<div id="submitArea">
<input type="submit" value="Enter me to win!"><br>
Fields highlighted with red labels <strong>must</strong> be filled in
</div>
</form>

</body>
</html>
